<template>
	<view class="d-flex mvideo flex-column" :style="{width:'100%',height:videoPageHeight-(showtype==1?tabbarH:0)+'px'}">
		<u-toast ref="uToast" />
		<view class="d-flex" :style="{width:'100%',height:videoPageHeight-50-(showtype==1?tabbarH:0)+'px'}">
			<swiper ref="mySwiper" class="d-flex video-swiper" circular="true" @change="swiperChange" :current="swiperCurrent" :vertical="true"
				:duration="swiper_duration" >
				<swiper-item class="d-flex swiper-item" v-for="(item, index) in displaySwiperList" :key="index">
					<!-- 视频 -->
					<!-- {{'album_id=='+item.album_id}}
					{{'dy_episodes_id=='+item.dy_episodes_id}} -->
					<!-- {{animationfinish_index==index}} -->
					<!-- 	<view style="position: absolute;top: 10vh;left: 200px;z-index: 9999;color: white;">
							<view class="" style="width: 50px;height: 50px;background: red;" @tap.stop="diytest">
								isShowRightStatus{{isShowRightStatus}}
								isShowTimeStatus{{isShowTimeStatus}}
						
							</view>
						
						</view> -->
					<template v-if="originIndex+1==item.playlet_number&&item.dy_episodes_id =='7306410606550483493'">
						<video v-if="diyshowvideo" :id="`video__${index}`" :controls="controls" :show-fullscreen-btn="showFullscreenBtn" :autoplay="false" :loop="loop"
							:data-index="index" play-strategy=2 :show-center-play-btn="false" @timeupdate="timeUpdate($event)" @controlstoggle="controlstoggle" 
							@play="playhandler($event)" @error="errorFn" :object-fit="objectFit" @waiting="waitingFn"
							@loadedmetadata="loadedmetadata($event)" @ended="onended"
							class="d-flex video-player" :src="item.dy_original_url"></video>
					</template>
					<template v-else>
						<video-player
						 v-if="diyshowvideo"
						:ref="`video__${index}`" :id="`video__${index}`" :version="1" :cloud-type="1" :album-id="item.album_id" :episode-id="item.dy_episodes_id" 
						:controls="controls" :show-fullscreen-btn="showFullscreenBtn" :autoplay="false" :loop="loop" @loadedmetadata="loadedmetadata($event)"
						@waiting="waitingFn"
						@timeupdate="timeUpdate($event)"
						@getsource="getsourceFn" :data-index="index" 
						@controlstoggle="controlstoggle"
						@play="playhandler($event)" 
						@error="errorFn" 
						@ended="onended"
						:object-fit="objectFit" 
						class="d-flex video-player">
						</video-player>
					</template>
					<!-- 封面 -->
					<image :src="item.cover" class="position-absolute top-0 left-0 video-poster" :style="{zIndex:isStop2 || index != displayIndex ||  (item.pay_staus!=1 && !user_isVip) ? 3:-1 ,width:'100%',height:videoPageHeight-50-(showtype==1?tabbarH:0)+'px'}" mode="scaleToFill"></image>
					<!-- 加载loadding -->
					<view class="position-absolute top-0 left-0 d-flex a-center j-center" :style="{width:'100%',height:videoPageHeight-50-(showtype==1?tabbarH:0)+'px'}">
						<view class="d-flex bg-white3 a-center j-center p-5 rounded30" :style="{zIndex:(waiting || isStop2) && (item.pay_staus ==1 || user_isVip) && index == displayIndex ?4:-1 }">
							<u-loading-icon mode="circle" size="50" color="#ffbb65" inactiveColor="#ffffff"></u-loading-icon>
						</view>
					</view>
					<!-- 点击显示播放or暂停 -->
					<view class="video-mask" @tap.stop="clickVideo"></view>
					<!-- 额外内容-插槽 -->
					<!-- <slot :listitem="item"></slot> -->
				</swiper-item>
			</swiper>
		</view>
		
		<template v-if="videoPageHeight">
			<!-- 进度时间 -->
			<view v-if="isDrag" class="position-fixed top-0 dragTime d-flex a-center j-center" :style="{width:screenWidth+'px',height:videoPageHeight-50+'px'}">
				<view class="d-flex flex-row bg-black py-3 px-5 rounded20">
					<text class="d-flex text-white mr-2 font-weight font-big">{{dragStarTime}}</text>
					<text class="d-flex text-lightbg font-big">/</text>
					<text class="d-flex text-lightbg ml-2 font-big">{{dragEndTime}}</text>
				</view>
			</view>
			
			<!-- 底部选集、进度条 -->
			<view class="d-flex flex-1 flex-column video_bottom videoBottomBg">
				<view class="d-flex flex-1 j-center video-time" v-if="isShowTimeStatus" :animation="cur_ani"
					:style="{height:(screenHeight/screenWidth > 1.78&&showtype==2)?(68+xBarHeight+'px'):(50+xBarHeight+'px')}">
					<view class="d-flex a-center j-center" :style="{width:screenWidth-30+'px',height: '50px'}">
						<view class="d-flex a-center j-end video-time-current" style="width: 85px;height: 50px;">
							<text class="d-flex">{{ dragStarTime }}</text>
						</view>
						<!-- 进度栏 -->
						<view class="d-flex flex-column j-center slider-view" style="height: 50px;">
							<u-slider class="m-0" :value="currentTime" step="1" :min="0" :max="video_duration" :blockSize="20" inactiveColor="rgba(255, 255, 255, 0.2)"
							activeColor="#f47920"
							blockColor="#f47920"
							@changing="sliderChanging" @change="sliderChange($event,originList[originIndex])"></u-slider>
						</view>
						<view class="d-flex a-center j-start video-time-current" style="width: 85px;height: 50px;">
							<text class="d-flex">{{ dragEndTime }}</text>
						</view>
					</view>
				</view>
				<!-- 当前集数 -->
				<view class="d-flex flex-1 video-info-current" v-if="isShowRightStatus" @tap.stop="touchSwitch">
					<view class="d-flex flex-1 a-center" style="height: 50px;">
						<!-- 旋转光盘 -->
						<view class="video-disk">
							<view class="music-cover" :style="muted?'':'animation: rotate 5s linear infinite;'">
								<image class="music-disk" src="@/static/images/icon_disk.png"></image>
							</view>
						</view>
						<!-- {{JSON.stringify(originList[originIndex])}} -->
						<!-- 名称 -->
						<text class="d-flex" style="margin-left: 20upx;font-size: 32rpx;">{{originList[originIndex].name||''}}</text>
						<!-- <text class="d-flex flex-shrink" style="margin-left: 10upx;font-size: 32rpx;">
							{{originList[originIndex].playlet_number_name||''}}
						</text> -->
						<!-- 弹簧 -->
						<view style="flex: 1;"></view>
						<!-- 选集 -->
						<view class="d-flex video-info-btn a-center flex-shrink">
							<text class="arrow-right-title">{{showtype==2?'选集':'看全集'}}</text>
							<image style="width: 16px;height: 16px;" src="@/static/video/video-right.png"></image>
						</view>
					</view>
				</view>
			</view>
			
			<!-- 播放暂停 -->
			<image v-if="isShowTimeStatus&&!waiting&&!isDrag" :data-index="index" @tap.stop="clickPlay" class="playState diydingwei1"
				:src="curStatusRes" :animation="cur_ani"></image>
			<!-- 需要购买-暂停播放 -->
			<image v-if="showBuy" :data-index="index" @tap.stop="clickPay(originIndex)" class="playState diydingwei2"
				:src="pause_res"></image>
				
			<!-- 右侧工具 -->
			<view class="video-tools" v-if="isShowRightStatus" :style="{bottom:menuInfo.length>=4?'10vh':'28vh'}">
				<view class="control-wrap">
					<block v-if="is_change" v-for="(tab,tabid) in menuInfo" :key="tabid">
						<button class="item" @click="clickRightIcon(tab)">
							<image class="icon icon-like" :src="'/static/video/'+tab.icon"></image>
							<view class="txt">
								{{getCurNum(tab,originIndex) }}
							</view>
						</button>
					</block>
				</view>
			</view>
		</template>
		
		<!-- 提示 -->
		<u-popup :show="tipsPopup" mode="center" bgColor="transparent" overlayOpacity="0.8"
			:closeOnClickOverlay="false" round="10">
			<view class="d-flex flex-column rounded20 overhide a-center j-center bg-white"
				style="width: 680rpx;height: 320rpx;">
				<text class="d-flex font-md5 font-weight text-black9">{{tipsContent}}</text>
				<view class="d-flex flex-row flex-nowrap j-sb mt-5" style="width: 580rpx;">
					<view class="d-flex a-center j-center rounded60 font-md3 bg-lightbg3"
						style="width: 260rpx;height: 92rpx;" @tap.stop="tipsPopup=false">
						<text class="d-flex text-black9 font-weight">取消</text>
					</view>
					<view class="d-flex bg-gradual-orange-n a-center j-center rounded60 font-md3"
						style="width: 260rpx;height: 92rpx;" @tap.stop="buy_and_pay(originList[originIndex],false,false)">
						<text class="d-flex text-white font-weight">确定</text>
					</view>
				</view>
			</view>
		</u-popup>
		<!-- 充值 -->
		<!-- <u-popup :show="showRecharge" mode="bottom" bgColor="transparent" closeOnClickOverlay @open="showRecharge=true" @close="showRecharge=false">
			<chongzhi :curInfo="originList[originIndex]" @closeCz="showRecharge=false" :init="showRecharge" @buySuccess="buySuccessFn"></chongzhi>
		</u-popup> -->
		
		<view v-show="showRecharge" class="diyjilibox" @tap.stop="clearmask">
			<view class="c_box">
				<view class="c_box_title">
					恭喜获得免费看剧资格
				</view>
				<view class="c_box_btn" @tap.stop="goAdvertisement">
					观看广告解锁剧
				</view>
				<view v-show="show_countdown" class="c_box_bottom">
					{{diy_countdown}}秒后自动进入广告解锁剧集
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	let hideTimeSetTime,wtimeSetTime,wtime=0;
	let diy_ad = null;
	import tools from "@/utils/tools.js";
	import config from '@/utils/config.js';
	import interfaces from '@/utils/interfaces.js'
	import chongzhi from '@/components/mvideo/chongzhi.vue';
	export default {
		components: {
			chongzhi
		},
		props:{
			/**
			 * 从哪一集开始播放
			 */
		
			startNumber: {
				type: Number,
				default: 1
			},
			/**
			 * 视频列表
			 */
			videoList: {
				type: Array,
				default: () => [],
			},
			orgvideoList: {
				type: Array,
				default: () => [],
			},
			/**
			 * 是否循环播放一个视频
			 */
			loop: {
				type: Boolean,
				default: false,
			},
			/**
			 * 是否更新购买列表
			 */
			updateBuy: {
				type: Boolean,
				default: false,
			},
			/**
			 * 当视频大小与 video 容器大小不一致时，视频的表现形式。contain：包含，fill：填充，cover：覆盖
			 */
			objectFit: {
				type: String,
				default: 'fill',
			},
			/**
			 * 是否显示原生控制栏
			 */
			controls: {
				type: Boolean,
				default: false,
			},
			/**
			 * 是否显示全屏按钮
			 */
			showFullscreenBtn: {
				type: Boolean,
				default: false,
			},
			/**
			 * 是否自动播放
			 */
			autoplay: {
				type: Boolean,
				default: true,
			},
			/**
			 * 是否自动滚动播放
			 */
			autoChange: {
				type: Boolean,
				default: true,
			},
			/**
			 * 滚动加载阈值（即播放到剩余多少个之后触发加载更多
			 */
			// loadMoreOffsetCount: {
			// 	type: Number,
			// 	default: 2,
			// },
			/**
			 * 显示类型
			 */
			showtype: {
				type: Number,
				default: 1,
			},
			//购买解锁的剧集id集合
			buy_episodes_list: {
				type: Array,
				default: []
			},
			//点赞列表
			my_like_list: {
				type: Array,
				default: []
			}
		},
		data() {
			return {
				show_countdown:true,
				diy_countdown:3,
				diy_countdown_timer:null,
				clone_displayList:[],
			
				diyshowvideo:true,
		
				diyawayPlay:false,
				timer:null,
				playetimer:null,
				user_is_buy:false,//用户是否购买了
				waiting:true,//视频是否出现缓冲loading
				swiper_duration:450,
				sourced:[false,false,false],//获取视频资源完成
				tipsPopup:false,
				tipsContent:"",
				user_isVip:false,
				initStartNumber:1,
				isStop2:true,
				isStop:false,
				is_change:false,
				hidecover_index:-1,
				lastUpdateTime:0,
				showBuy:false,
				NoFastTime: [],//连续多少集没有快进的集合
				isFastForward: false,
				showRecharge: false,
				init_recharge: false,
				//以下是项目自定义
				ishdtip: false,
				showvl: false, //视频列表
				showfk: false, //反馈
				muted: false,
				thevdInfo: null, //当前播放的视频
				myuserInfo: {},
				ml_coin: 0, //金币-账户余额
				vdoc: '', //当前播放视频的ID
				isShowTimeStatus: false, // 时间进度条控制
				isShowRightStatus: true,  //底部和右侧显示控制
				// 当前时长
				currentTime: 0,
				// 总时间
				video_duration:0,
				isDrag: false,
				autoscroll: false,
				dragStarTime: '',
				dragEndTime: '',
				my_buy_episodes_list: [],
				diyduration:[0,0,0],
				duration_map: new Map(),
				currentTime_map: new Map(),
				curStatusRes: '/static/video/video-play.png',
				pause_res: '/static/video/video-pause.png',
				play_res: '/static/video/video-play.png',
				hide_ani: '',  
				show_ani: '',  
				cur_ani: '',  
				not_ani: '',  
				menuInfo: [{
					name:"点赞",
					sum: 999,
					icon: 'img-video-dianzan0.png'
				}, {
					name:"追剧",
					sum: 0,
					icon: 'img-video-shoucang0.png'
				}, 
		 
				{
					name:"福利",
					sum: 0,
					icon: 'img-video-renwu.png'
				}],
				
				originList: [], // 源数据
				displaySwiperList: [], // swiper需要的数据
				displayIndex: 0, // 用于显示swiper的真正的下标数值只有：0，1，2。
				originIndex: 0, // 记录源数据的下标
				swiperCurrent: 0,
				animationfinish_index:0,
	
				showControls: "",
			};
		},
		computed: {
			...mapState({
				// continuous: state => state.user.continuous,
				userInfo: state => state.user.userInfo,
				statusBarHeight: state => state.layout.statusBarHeight,
				tabbarH: state => state.layout.tabbarH,
				screenWidth: state => state.layout.screenWidth,
				screenHeight: state => state.layout.screenHeight,
				windowWidth: state => state.layout.windowWidth,
				windowHeight: state => state.layout.windowHeight,
				videoPageHeight: state => state.layout.videoPageHeight,
				platform: state => state.layout.platform,
				xBarHeight: state => state.layout.xBarHeight//苹果手机安全区高度
			}),

		},
		
		watch: {
		    videoList: {
		      handler(newVal, oldVal) {
		        // 数组发生变化时的处理
				console.log(368,newVal)
				this.originList = newVal;
		      },
		      deep: true
		    },
			buy_episodes_list: {
			  handler(newVal, oldVal) {
			    // 数组发生变化时的处理
					console.log(376,newVal)
				this.my_buy_episodes_list = newVal;
			  },
			  deep: true
			}
		  },
		
		 created() {
			let that = this;
		    this.initStartNumber = this.startNumber; // 将父组件传递的数据赋值给新的变量
			this.originList = this.videoList; // 传过来的源数据
			this.originIndex = this.initStartNumber - 1; // 源数据下标
			this.my_buy_episodes_list = this.buy_episodes_list // 购买数据列表
			this.initcurrentData(); // 初始化子组件数据
			this.checkbug();//首次进入判断
		  },
		mounted(){
			this.tipsPopup = false;
			wtimeSetTime = setTimeout(()=>{
				wtime = 1;
			},1200)
			//
			diy_ad = tt.createRewardedVideoAd({
				adUnitId:'y0h8bdsxm8d70344wi'
			});
			diy_ad.onLoad(()=>{
				console.log(422,'拉取激励广告成功')
			})
			diy_ad.onError(err => {
				console.log(423)
				tt.hideLoading();
			})
			diy_ad.onClose(data=>{
				tt.hideLoading();
				if(data.isEnded){
					console.log('观看了',data.count,'个视频')
				}else{
					console.log('未观看完视频')
				}
			})
			diy_ad.load();
		},
		
		onHide(){
			console.log(370)
			this.pauseVideo();
		},
		beforeDestroy(){
			console.log(374)
			this.pauseVideo();
		},
		destroyed(){
			uni.setNavigationBarTitle({title: ''});
			if(wtimeSetTime) clearTimeout(wtimeSetTime);
		},
		methods: {
			goAdvertisement(){ //广告
				console.log(449)
				// tt.showLoading();
				let that = this
				
				diy_ad.show().then(()=>{
					console.log(457,'广告显示成功')
					clearInterval(that.diy_countdown_timer)
					that.diy_countdown = 3
					that.show_countdown = false
				})
				.catch((err)=>{
					console.log(460,'广告组件出现问题',err)
					diy_ad.load().then(()=>{
						console.log(464,'手动加载成功')
						diy_ad.show()
					})
				})
			},
			clearmask(){
				this.showRecharge = false
				clearInterval(this.diy_countdown_timer)
				this.diy_countdown = 3
			},
			//初始化子组件数据
			initcurrentData(){
				let that = this;
				tools.isVip(that, (is_vip) => {
					that.user_isVip = is_vip;
					console.log('是否是VIP：'+is_vip);
					// 大于第一集跳集
					if(this.initStartNumber>1){
						console.log('大于第一集跳集');
						that.scrollVideo(this.initStartNumber,true);
					}else{
						console.warn('===初始化播放===');
						that.setCurVdInfo(that.originList[0]);
						that.initSwiperData();
					}
				});
			},
			
			// diytest(){
			// 	// this.updateBuyList(44,true)  //测试整剧
			// 	this.buySuccessFn(3) // 测试vip
			// }, 
			
			allEpisodeinit(){
				setTimeout(()=>{
					this.originList = this.videoList; // 传过来的源数据
					console.log(408,this.originList)
					
					this.my_buy_episodes_list = this.buy_episodes_list;
					console.log(409,this.buy_episodes_list)
					let currentData = this.originList[this.originIndex]||{};
					if(currentData){
						if(currentData.pay_staus === config.pay_staus.purchased){
							console.log(420,currentData)
							this.setCurVdInfo(currentData);
							this.initSwiperData();
						}
					}
				},300)
			},
			
			//判断用户是否购买
			checkbug(){
				let that = this;
				let currentData = this.originList[this.originIndex]||{};
				console.log(410,currentData)
				if(this.showtype == 2){
					if (currentData) {
						console.log(429,currentData.pay_staus,config.pay_staus.purchased)
						if (currentData.pay_staus === config.pay_staus.purchased) {
							this.showBuy = false;
							return
						} else {
							console.log(435,this.user_isVip)
							if (this.user_isVip) {
								this.showBuy = false;
								return
							}
							console.log(439,this.isBuy(currentData.playlet_number))
							if (this.isBuy(currentData.playlet_number)) {
								this.showBuy = false;
								return
							}
							this.showBuy = true;
							//判断用户是否购买
							console.warn('用户是否购买了' + this.isBuy(currentData.playlet_number));
							if (!this.isBuy(currentData.playlet_number)) {
								let playlet_id_buy = uni.getStorageSync('playlet_id_buy') || [];
								console.log(currentData.playlet_id);
								console.log(playlet_id_buy);
								if (playlet_id_buy.indexOf(currentData.playlet_id) > -1) {
									this.clickPay(this.originIndex, false);
								} else {
									this.clickPay(this.originIndex, true);
								}
							}
							return
						}
					}
				}
				this.showBuy = false;
			},
			
			// 切换选集
			touchSwitch() { //弹出选集
				console.log(475,'touchSwitch')
				if (this.showtype === 1) { //推挤 的 看全集
					console.warn('推荐-选集-跳转');
					let {playlet_id,name,last_episode_number,playlet_number} = this.originList[this.originIndex];
					tools.jump_video_page_by_info({playlet_id,name,last_episode_number,playlet_number}) //页面跳转
				} else {  // videopage页的 选集
					console.warn('剧集弹窗');
					this.$emit('clickEpisode',this.originList[this.originIndex]); //弹窗选集
				}
			},
			onended(e) { //视频结束回调
				console.warn('======当播放到末尾时触发=======');
				this.nextPlayer();
			},
			
			nextPlayer(){ //自动滑到下一个视频
				console.warn('===自动切换下一个视频==='+this.displayIndex);
				// 自动切换下一个视频 
				// this.swiperCurrent = this.displayIndex + 1 > 2 ? 0 : this.displayIndex + 1
				// 	console.log(458,this.swiperCurrent);
				if (this.autoChange) {
						console.log(526,this.displayIndex)
						this.waiting = true ;
						this.isStop = false;
						this.isStop2 = false;
						const originListLength = this.originList.length;
						console.log(520,this.originIndex)
						this.scrollVideo(this.originIndex + 2 == originListLength + 1 ? 1 : this.originIndex + 2 ,true,true)
				}
			},
			// 视频出现缓冲时触发
			waitingFn({timeStamp}){
				this.waiting = true;
			},
			// 播放进度发生变化
			timeUpdate(e) {
				if(e.detail.currentTime>0.001&&e.detail.currentTime<=1){
					let index = e.currentTarget.dataset.index;
					this.hidecover_index = index;
				}
				if(e.detail.currentTime>0.001&&this.waiting){
					this.waiting = false;
					console.warn(this.waiting?'552===显示loadding===':'552===隐藏loadding===');
				}
				const currentTime = Math.round(e.detail.currentTime).toFixed(0);
				if(this.currentTime == currentTime) return;
				// console.log(currentTime);
				this.lastUpdateTime = currentTime;
				// 拖拽时不需要进行更新
				if (!this.isDrag) {
					// 更新进度
					this.currentTime_map.set(e.currentTarget.id, currentTime);
					this.currentTime = this.currentTime_map.get(`video__${this.displayIndex}`);
					this.reloadVideoTime();
					// 返回当前播放时间
					// this.$emit('timeupdate', e);
				}
			},
			// 正在拖拽
			sliderChanging(value) {
				if(!this.isDrag){
					console.log('暂停');
					this.pauseVideo();
					this.cur_ani = "";
					if(hideTimeSetTime) clearTimeout(hideTimeSetTime);
					this.isShowTimeStatus = true;
					this.isShowRightStatus = false;
				}
				// 开始拖拽
				if(!this.isDrag) this.isDrag = true;
				
				//计算当前时间
				const currentTime = Math.round(value).toFixed(0);
				if(currentTime == this.currentTime) return;
				
				uni.$u.throttle(()=>{
					console.warn(558,currentTime - this.currentTime);
					this.currentTime = currentTime;
					// 刷新时间
					this.reloadVideoTime();
				}, 150,false);
			},
			// 拖拽结束
			sliderChange(value,item) {
			
				value = Math.round(value).toFixed(0);
				console.log(value);
				console.warn('===拖拽结束===');
				// 隐藏进度条
				this.showAndHideAni(false,200);
				//显示loadding
				this.waiting = true;
				// 停止拖拽
				this.isDrag = false;
				// 判断一下是否大于基础时间
				if (this.video_duration > 0) {
					console.warn('===拖拽结束===');
					let videoContextPrev;
					if(item.dy_episodes_id =='7306410606550483493'){
						videoContextPrev = uni.createVideoContext(`video__${this.displayIndex}`, this);
						// 跳到指定时间点
						console.warn('===跳到指定时间点====');
						console.log(value);
						this.currentTime = value;
						videoContextPrev.seek(value);
						// 并调用播放
						setTimeout(() => {
							videoContextPrev.play();
						}, 100)
					}else{
						if(Array.isArray(this.$refs[`video__${this.displayIndex}`])&&this.$refs[`video__${this.displayIndex}`].length){
							videoContextPrev = uni.createVideoContext(`video__${this.displayIndex}`, this.$refs[`video__${this.displayIndex}`][0]);
						}
						console.log("sliderChange", value);
						if(this.video_duration == value){
							console.warn('===结束了，下一个视频====');
							this.nextPlayer();
							return
						}
						if(typeof videoContextPrev == 'object'&&videoContextPrev!=null){
							// 跳到指定时间点
							console.warn('===跳到指定时间点====');
							this.currentTime = value;
							videoContextPrev.seek(value);
							// 并调用播放
							setTimeout(() => {
								videoContextPrev.play();
							}, 100)
						}
					}
					this.showAndHideAni(false)
				}
			},
			// 刷新当前时间
			reloadVideoTime() {
				try{
					// 当前时间
					this.dragStarTime = tools.ms_time(this.currentTime);
				}catch(e){
				}
			},
		
			getVideoDuration() {	// 获取视频总时间
				try{
					let duration = this.diyduration[this.displayIndex]
					// 记录视频总时间
					this.video_duration = Math.round(duration);
					// 总时间
					this.dragEndTime = tools.ms_time(this.video_duration);
				}catch(e){
				}
				
			},
			getsourceFn(e){ //video 获取视频资源完成回调
				//当前轮播项获取资源完成后 播放
				console.log(660,e.currentTarget.id,`video__${this.displayIndex}`)
					if(e.currentTarget.id == `video__${this.displayIndex}`){
						setTimeout(()=>{
							console.log(688,this.diyawayPlay)
							if(this.diyawayPlay){
								console.warn(633,`===========获取资源完成video__${this.displayIndex}=======`);
								if(!this.isStop){
									//播放
									console.log(669,'获取资源加载===》')
									this.playVideo(true);
								}
							}
						},250)

					}
			},
			// 加载完成
			loadedmetadata(e) {
				console.warn('加载完成=======================');
				const {
					duration
				} = e.detail
				let index = e.currentTarget.dataset.index;
				this.duration_map.set(e.currentTarget.id, duration)
				let _diyduration = this.diyduration
				_diyduration[index] = duration
				this.diyduration = _diyduration
				console.warn('加载完成'+e.currentTarget.id);
				console.log(6288,index,this.displayIndex)
				if(index==this.displayIndex){
					//获取总时间
					this.getVideoDuration();
				}
			},
		
			initSwiperData(originIndex = this.originIndex,tiao) { //重置轮播数据
				
				console.warn(628,originIndex);
				// 暂停/停止视频
				this.showBuy = false;
				this.pauseVideo();
				
				let diycl = JSON.parse(JSON.stringify(this.displaySwiperList))
				console.log(670,diycl)
				console.log(671,this.swiperCurrent,this.displayIndex)
				
				const originListLength = this.originList.length; // 源数据长度
				const displayList = [];
				displayList[this.displayIndex] = this.originList[originIndex]; //当前的轮播项赋予 源数据
				//往回切
				// 若轮播当前项等于 0 ，那么轮播的最后一项赋值 （若源数据index指向为0 ，那就赋予源数据的最后一项，否则就是index指向的前一项）
				// 若轮播当前项不等于 0 ，就修改前一项的轮播项
				displayList[this.displayIndex - 1 == -1 ? 2 : this.displayIndex - 1] =
					this.originList[
						originIndex - 1 == -1 ? originListLength - 1 : originIndex - 1
					];
					
				//向前切
				// 若当前轮播项是 2 ，向前切是就是 第0项 ，第0项赋予 （向前切判断源数据index + 1 是否等于源数据长度，）
				// （源数据index + 1 等于 源数据长度 ---》 源数据index就变成0，回到第一个 ，否则就是 源数据index + 1 ）
				
				displayList[this.displayIndex + 1 == 3 ? 0 : this.displayIndex + 1] =
					this.originList[originIndex + 1 == originListLength ? 0 : originIndex + 1];
			
				let jilu = [false,false,false]
				let clone_displayList = this.clone_displayList
				displayList.forEach((item,i)=>{
					clone_displayList && clone_displayList.forEach(item2=>{
							if( item.dy_episodes_id == item2.dy_episodes_id){
								jilu[i]=true
							}
					})
				})
				setTimeout(()=>{
					this.clone_displayList = JSON.parse(JSON.stringify(displayList))	
				},0)
				this.sourced = jilu
				console.log(757,jilu,this.displayIndex)
		
				
				//让封面和加载loadding 层级提到上层显示
				if(this.isStop) this.isStop = false;
				
				// 用户不是vip的情况      config.pay_staus.purchased =》 1
				if(!this.user_isVip){
					// 该视频的pay_staus !=1 && 没有购买 
					if (this.originList[originIndex].pay_staus != config.pay_staus.purchased && !this.isBuy(this.originList[originIndex].playlet_number)) {
						this.isStop = true;
						this.checkbug()
					}
				}

				if(tiao){
					this.displaySwiperList = displayList;
					setTimeout(()=>{
						console.log(761,!this.isStop)
						if(!this.isStop){
							if(this.sourced[this.displayIndex]){
								// console.log(712)
								this.playVideo(true);
							}else{
								this.diyawayPlay = true;
							}
						}
					},300)

					return 
				}
				
					// 轮播数据
					this.displaySwiperList = displayList;
					console.log(691,JSON.parse(JSON.stringify(this.displaySwiperList)));
					console.log(705,!this.isStop)
					if(!this.isStop){
						console.log(667,this.sourced)
						if(this.sourced[this.displayIndex]){
							console.log(712)
							this.playVideo(true);
						}else{
							this.diyawayPlay = true;
						}
					}
			},
			/**
			 * swiper滑动时候
			 */
			swiperChange(event) { //切换轮播图
				const {
					current
				} = event.detail;
				console.log(796,current,this.swiperCurrent,event)
				this.isStop2 = true;
				this.isShowRightStatus = true;
				this.isShowTimeStatus = false;
				clearTimeout(this.timer)
				this.scrollVideo(current);
			},
			
			scrollVideo(current,init=false,xuan=false){ //滑动后处理数据
				this.hidecover_index = -1; //封面层级
				this.isStop2 = true;
				console.warn('是否初始化：',current,init);
				if(init){ //除了切换轮播图时不会调用，其他都会调用
					this.originIndex = current-1;
					clearTimeout(this.timer)
					this.timer = setTimeout(()=>{
						this.initSwiperData(this.originIndex,xuan);
					},450)
				
					this.setCurVdInfo(this.originList[this.originIndex]);
				}else{ //切轮播图
					console.log(696)
					const originListLength = this.originList.length; // 源数据长度
					// 向后滚动
					if (this.displayIndex - current == 2 || this.displayIndex - current == -1) {
						this.originIndex =
							this.originIndex + 1 == originListLength ? 0 : this.originIndex + 1;
						this.displayIndex =
							this.displayIndex + 1 == 3 ? 0 : this.displayIndex + 1;
					
							clearTimeout(this.timer)
							this.timer = setTimeout(()=>{
								this.initSwiperData(this.originIndex);
							},450)
					}
					// 如果两者的差为-2或者1则是向前滑动
					else if (
						this.displayIndex - current == -2 ||
						this.displayIndex - current == 1
					) {
						console.log(716)
						this.originIndex =
							this.originIndex - 1 == -1 ?
							originListLength - 1 :
							this.originIndex - 1;
						this.displayIndex =
							this.displayIndex - 1 == -1 ? 2 : this.displayIndex - 1;
					
						console.warn('===滑上一个===');
						clearTimeout(this.timer)
						this.timer = setTimeout(()=>{
							this.initSwiperData(this.originIndex);
						},450)
						
					}
				
					this.setCurVdInfo(this.originList[this.originIndex]);
					
				}
			},
			
			controlstoggle(e) {
				this.showControls = e.detail.show;
				this.$emit("videoControlstoggle", e);
			},
			isBuy(playlet_number) {
				console.warn('======是否购买=====');
				this.user_is_buy = false;
				this.my_buy_episodes_list = this.buy_episodes_list // 购买数据列表
				console.log(this.my_buy_episodes_list);
				for (var i = 0; i < this.my_buy_episodes_list.length; i++) {
					if (playlet_number === this.my_buy_episodes_list[i]) {
						this.user_is_buy = true;
						return true;
					}
				}
				return false;
			},
			updateBuyList(playlet_id,all = false) {
				this.$emit('updateBuyList',playlet_id,all);
			},
			buySuccessFn(type) {
				this.showRecharge = false;
				this.showBuy = false;
				if(type==1){
					console.warn('===普通充值4444支付成功，去自动购买解锁===');
					this.clickPay(this.originIndex, false);
				}else if(type==2){
					console.warn('===整剧解锁-去刷新购买剧集===');
					this.updateBuyList(this.originList[this.originIndex].playlet_id ,true);
				}else if(type==3){
					console.warn('=====购买了VIP=====');
					this.user_isVip = true;
					this.scrollVideo(this.originIndex+1,true);
				}
			},
			clickPay(index, isShowTips = true) {
				let that = this
				if(this.showtype!=2) return;
				let info = that.originList[index];
				let cur_playlet_buyr = info.amount;
				if(!cur_playlet_buyr) return;
				console.log('clickPayclickPayclickPayclickPay');
				tools.isVip(that, (is_vip) => {
					if (!is_vip) {
						console.warn('=====55555非VIP=====');
						if (tools.is_can_consume(cur_playlet_buyr)) {
							console.warn('是否购买了:'+that.isBuy(info.playlet_number));
							if (that.isBuy(info.playlet_number)) {
								this.showBuy = false;
								console.warn("===66666已购买===")
							} else {
								console.warn('确认没有购买');
								let name = uni.getStorageSync(config.coin_name) || "";
								if (isShowTips) {
									this.tipsPopup = true;
									this.tipsContent = "是否使用" + cur_playlet_buyr + name + "观看？";
									// uni.showModal({
									// 	title: "是否使用" + cur_playlet_buyr + name + "观看？",
									// 	showCancel: true,
									// 	success: (res) => {
									// 		if (res.confirm) {
									// 			that.buy_and_pay(info,false,false);
									// 		}
									// 	}
									// })
								} else {
									console.warn("===66666去购买===")
									that.buy_and_pay(info,false,false);
								}
							}
						} else {
							console.log('充值页面-弹窗1111');
							that.pauseVideo()
							that.show_countdown = true
							that.showRecharge = true;
							that.diy_countdown_timer = setInterval(()=>{
								console.log(975)
								if(that.diy_countdown==0){
									console.log(977)
									clearInterval(that.diy_countdown_timer)
									that.goAdvertisement()
									that.diy_countdown = 3
									return
								}
								that.diy_countdown = that.diy_countdown - 1
							},1000)
							
						}
					} else {
						console.warn('=====VIP=====');
						// uni.showToast({
						// 	title: "vip免费观看！"
						// })
						// that.buy_and_pay(info,true,true)
					}
				})
			},
			buy_and_pay(info, is_vip=false,isAutoBuy = false) {
				let that = this;
				let {amount,playlet_id,playlet_number} =  info;
				console.log('vip：' + is_vip);
				if (!is_vip) {
					tools.consume_playlet(that, playlet_id, playlet_number, (r1) => {
						console.warn('===77777购买结果回调====');
						console.log(r1);
						if (typeof r1 == 'object' && r1 != null) {
							if (r1.code == config.SUCCESS) {
								that.updateBuyList(playlet_id);
								console.log('isAutoBuy：' + isAutoBuy);
								let id_buy = uni.getStorageSync('playlet_id_buy') || [];
								if (id_buy.indexOf(playlet_id) == -1) {
									id_buy.push(playlet_id);
									uni.setStorageSync('playlet_id_buy', id_buy);
								}
								that.initStartNumber = playlet_number;
								that.originList[that.originIndex].pay_staus = 1;
								tools.get_user_info_by_serve(that, (res) => {
									console.log(941,res)
								});
								//解锁成功去播放
								that.playVideo()
								// that.checkbug()
								//播放
								console.warn('======解锁成功======');
								setTimeout(() => {
									this.tipsPopup = false;
									that.showBuy = false;
									uni.showToast({
										title: "解锁成功！",
										duration: 1000,
										icon: "none"
									})
								}, 10)
							} else {
								setTimeout(() => {
									this.tipsPopup = false;
									uni.showToast({
										title: "解锁失败！" + (r1.message ? r1.message : ''),
										duration: 1000,
										icon: "none"
									})
								}, 10)
								return;
							}
						}
					})
				} else {
					that.updateBuyList(playlet_id);
					that.$nextTick(() => {
						that.scrollVideo(playlet_number,true);
					})
				}
			},
			stopVideo(){
				for (let i = 0; i < 3; i++) {
					uni.createVideoContext(`video__${i}`, this.$refs[`video__${i}`][0]).stop();
				}
			},
			pauseVideo(){ //暂停视频
				let isMP4 = false;
				//判断是否 是那个用video的视频
				if(this.originList[this.originIndex].dy_episodes_id =='7306410606550483493'){
					isMP4 = true;
				}
				
				for (let i = 0; i < 3; i++) {
					if(i==this.displayIndex){ //当前轮播图的current
						if(isMP4){  //用video的视频
							uni.createVideoContext(`video__${i}`, this).pause();
						}else{  //其他视频 video-player
							if(Array.isArray(this.$refs[`video__${i}`])&&this.$refs[`video__${i}`].length){
								uni.createVideoContext(`video__${i}`, this.$refs[`video__${i}`][0]).pause();
							}
						}
					}else{ // 非当前轮播 项
						if(isMP4){  //用video的视频
							uni.createVideoContext(`video__${i}`, this).stop();
						}else{ //其他视频 video-player
							if(Array.isArray(this.$refs[`video__${i}`])&&this.$refs[`video__${i}`].length){
								uni.createVideoContext(`video__${i}`, this.$refs[`video__${i}`][0]).stop();
							}
						}
					}
				}
				
			},
			
			playVideo(isSeek=false){
				if(this.displaySwiperList[this.displayIndex].pay_staus == 1  || this.user_isVip){
					this.diyawayPlay = false
					let isMP4 = false;
					//判断是否 是那个用video的视频
					if(this.originList[this.originIndex].dy_episodes_id =='7306410606550483493'){
						isMP4 = true;
					}
					if(isMP4){ 
						uni.createVideoContext(`video__${this.displayIndex}`, this).play();
					}else{
						let refs = this.$refs[`video__${this.displayIndex}`],videoContext;
						console.log(973,refs)
						if(Array.isArray(refs)&&refs.length){
							videoContext = uni.createVideoContext(`video__${this.displayIndex}`, this.$refs[`video__${this.displayIndex}`][0]);
						}
						
						if(typeof videoContext == 'object'&&videoContext!=null){
							if(isSeek){ //只有初始化的时候才会走这里
								videoContext.seek(0);
							}
							// 当前视频
					
							if (this.autoplay) {
								console.warn(`播放video__${this.displayIndex}`);
								setTimeout(()=>{
									videoContext.play();
								},350)
							}
						}
					}
				}else{
					this.pauseVideo()
				}	
			},
			diytest(){
				if(!this.isStop){
					//播放
					console.log(1093)
					this.playVideo(true);
				}
			},
			
			clickPlay() { 
					let that = this;
					console.warn('===点击按钮播放/暂停===');
					let current = this.swiperCurrent;
					if (this.showBuy) {
						return
					}
				
					let isPlayStatus = this.curStatusRes === this.play_res;
					if(!isPlayStatus){ //暂停状态进入
						setTimeout(()=>{
							console.warn('11111111111111');
							that.isShowTimeStatus = false;
							that.isShowRightStatus = true;
						},200)
					}
					console.warn('isPlayStatus：'+isPlayStatus);
					
					if (isPlayStatus) { //播放状态
						console.warn('===暂停视频===');
						this.pauseVideo();
					} else { //暂停状态
						//将点击视频进行播放
						console.warn('===播放视频===');
						that.playVideo();
					}
					// 播放状态设置 动画为 show_ani ，图片src为 pause_res 
					// 暂停状态设置 动画为 hide_ani ，图片src为 play_res
					this.cur_ani = isPlayStatus ? this.show_ani : this.hide_ani
					this.curStatusRes = isPlayStatus ? this.pause_res : this.play_res
			},
			
			diypause() {
				this.waiting = false;
				if (this.showBuy) {
					return
				}
				console.log(993,this.curStatusRes,this.play_res);
				this.pauseVideo();
				this.isShowRightStatus = false;
				this.isShowTimeStatus = true;
				this.curStatusRes = this.pause_res
			},
			
			// 点击播放或暂停
			clickVideo() { //点击屏幕透明遮罩层，
				 //显示时间进度条、暂停/播放按钮 ， 隐藏右边工具栏工具
				// debugger;
				let that = this
				console.log('点击播放或暂停');
				let current = this.swiperCurrent;
				if (this.showBuy) { //没有购买的 都直接退出
					console.log(994)
					return
				}
				this.isShowRightStatus = !this.isShowRightStatus;
				this.isShowTimeStatus = !this.isShowTimeStatus;
				console.log(1077,this.isShowRightStatus)
				console.log(1078,this.isShowTimeStatus)
				if (this.not_ani === '') {
					let ani = uni.createAnimation({
						timingFunction: "ease",
					});
					ani.opacity(0.5).step({
						duration: 0,
						delay: 0
					});
					this.not_ani = ani;
				}
				
				//显示隐藏动画
				that.showAndHideAni()
				
				if (this.show_ani == '') {
					let ani = uni.createAnimation({
						timingFunction: "linear",
					});
					ani.opacity(1).step({
						duration: 1500,
						delay: 0
					}); //描述动画
					this.show_ani = ani.export();
				}
				
				if (this.hide_ani == '') {
					let ani = uni.createAnimation({
						timingFunction: "ease",
					});
					ani.opacity(0.3).step({
						duration: 1500,
						delay: 0
					});
					this.hide_ani = ani.export();
				}
			},
			
			showAndHideAni(cur_ishide = true,hideTime = 2800) {
				let that = this
				if(hideTimeSetTime) clearTimeout(hideTimeSetTime);
				console.warn('cur_ishide：'+cur_ishide);
				if (cur_ishide) {
					that.cur_ani = this.not_ani;
				}
				if (this.isShowTimeStatus) {
					setTimeout(() => {
						that.cur_ani = that.show_ani;
					}, 50)
					hideTimeSetTime = setTimeout(() => {
						that.isShowTimeStatus = false; //隐藏时间进度条
						that.isShowRightStatus = true; //底部和右侧工具显示
						that.cur_ani = that.hide_ani; //动画
						console.log(1073,that.cur_ani)
					},hideTime)
				}
			},
			errorFn({detail}){ //视频错误回调
				console.warn('============播放错误============');
				console.log(detail);
				if(detail.errNo == 10401) return;
				// this.waiting = false;
				// that.$refs.uToast.show({message: '抱歉，播放失败'+detail.errMsg,type: 'error',icon:false,duration:2000});
			},
			playhandler(e){ //开始播放回调
				let that = this
				this.timer = null
				console.warn('==========播放========'+this.displayIndex,this.originList[this.originIndex].playlet_number_name);
				this.getVideoDuration()
				console.log(1064,this.diyduration)
				let index = e.currentTarget.dataset.index;
				this.isStop2 = false;
				this.hidecover_index = index;
				this.showAndHideAni(false)
				this.curStatusRes = this.play_res
				this.autoscroll = false
				this.originList[this.originIndex]['playTime'] = Date.now();
				that.$nextTick(() => {
					that.is_change = true;
				})
				console.log("playhandler")
				if (that.isLike()) {
					that.menuInfo[0].icon = "img-video-dianzan1.png";
				} else {
					that.menuInfo[0].icon = "img-video-dianzan0.png";
				}
				
				if (that.isZhuiJu()) {
					that.menuInfo[1].icon = "img-video-shoucang1.png";
				} else {
					that.menuInfo[1].icon = "img-video-shoucang0.png";
				}
				
				if(this.showtype==2){
						let obj = this.orgvideoList[this.originIndex]
						let _history = uni.getStorageSync(config.history) || []
						console.log(1184,obj)
						console.log(806,_history.some(i=>(i.playlet_id == obj.playlet_id && i.playlet_number == obj.playlet_number)))
						if(!_history.some(i=>(i.playlet_id == obj.playlet_id && i.playlet_number == obj.playlet_number))){
								console.log("有记录吗")
								console.log(1181,obj.pay_staus,!this.isStop2,this.user_isVip)
								if((obj.pay_staus == 0 && !this.isStop2) || this.user_isVip){
									console.log(1134)
									console.log(1133,"播放三秒后",obj.playlet_id,obj.playlet_number)
									that.request({
										url: interfaces.view_records,
										data: {
											"playlet_id": obj.playlet_id,
											"playlet_number": obj.playlet_number
										},
										method: config.post,
										success: (res) => {
											console.log(1201)
										},
										fail:(err)=>{
											console.log(1207)
										}
									});
								}
														
						}
				}
				tools.update_history(that.originList[that.originIndex]);

			},
			//判断当前播放视频是否点赞
			isLike() {
				let is_like = false;
				let playlet_id = this.originList[this.originIndex].playlet_id;
				let playlet_number = this.originList[this.originIndex].playlet_number;
				is_like = tools.get_like(playlet_id, playlet_number);
				if (is_like != null) {
					return is_like
				} else {
					is_like = false;
				}
			
				if (this.showtype === config.video_status.recommend) {
					if (this.originList[this.originIndex].is_likes === 1) {
						return true;
					}
				} else {
					for (var i = 0; i < this.my_like_list.length; i++) {
						if (playlet_number === this.my_like_list[i]) {
							return true;
						}
					}
				}
				return is_like;
			},
			//判断当前播放视频是否收藏追剧
			isZhuiJu() {
				let cur_index = this.curIndex;
				let is_zhuiju = false;
				let playlet_id = this.originList[this.originIndex].playlet_id
				let playlet_number = this.originList[this.originIndex].playlet_number
				is_zhuiju = tools.get_zhuiju(playlet_id)
				if (is_zhuiju != null) {
					return is_zhuiju
				} else {
					is_zhuiju = false;
				}
				return this.is_shou_cang;
			},
			
			getCurNum(tab, index) {
				if (tab.name == '点赞') {
					return this.originList[index].likes_number
				} else if (tab.name == '分享') {
					return this.originList[index].share_number
				} else {
					return tab.name
				}
			},
			//点击反馈
			onBtnFk() {
				console.warn('===点击反馈===');
				this.$emit('clickFeedback',this.originList[this.originIndex]);
			},
			// handleClick(e){
			// 	this.$emit("click", e);
			// },
			likeVideo(playlet_id, playlet_number){
				let islike = false;
				if (this.menuInfo[0].icon == "img-video-dianzan0.png") {
					this.menuInfo[0].sum++;
					this.menuInfo[0].icon = "img-video-dianzan1.png";
					islike = true;
				} else {
					this.menuInfo[0].sum--;
					this.menuInfo[0].icon = "img-video-dianzan0.png";
					islike = false;
				}
				tools.update_like(playlet_id, playlet_number, islike);
				console.log('update_likeupdate_like');
			},
			//当前剧名字
			setCurVdInfo(info) {
				console.warn('===设置当前剧信息===');
				console.log(info);
				this.$emit('curInfo',info);
				this.originIndex = (info.id-1);
				this.menuInfo[0].sum = info.likes_number
				this.menuInfo[2].sum = info.share_number
				uni.setNavigationBarTitle({
					title: info.playlet_number_name
				})
			},
			clickRightIcon(item) {
				let that = this
				switch (item.name) {
					case '点赞': {
						let playlet_id = that.originList[that.originIndex].playlet_id,
						playlet_number = that.originList[that.originIndex].playlet_number,
						stype = (this.menuInfo[0].icon == "img-video-dianzan0.png")?1:0;
						console.log(playlet_id,playlet_number,stype);
						console.log(tools);
						tools.like_video(that, playlet_id,playlet_number,stype, (res) => {
							console.log("like_video", res)
							if(typeof res == 'boolean'){
								if(res){
									this.likeVideo(playlet_id, playlet_number);
									return
								}
								this.$refs.uToast.show({
									title: '抱歉，点赞失败',
									type: 'error',
									icon:false,
									duration:2000
								})
							}
						})
					}
					break;
					case '追剧': {
						let iszhuiju = false;
						if (this.menuInfo[1].icon == "img-video-shoucang0.png") {
							// this.menuInfo[1].sum++;
							this.menuInfo[1].icon = "img-video-shoucang1.png";
							iszhuiju = true;
						} else {
							// this.menuInfo[1].sum--;
							this.menuInfo[1].icon = "img-video-shoucang0.png";
							iszhuiju = false;
						}
						let playlet_id = that.originList[that.originIndex].playlet_id
						tools.update_zhuiju(playlet_id, iszhuiju, this.originList[this.originIndex]);
					}
					break;
					case '分享': {}
					break;
					case '福利': {
						let isPlayStatus = this.curStatusRes === this.play_res;
						console.log(1439,isPlayStatus,this.timer)
						if(this.timer){
							console.log(1438,this.originIndex)
							this.pauseVideo();
							this.$emit('bofangzhong', this.originIndex)
						}else{
							if(isPlayStatus){
								this.diypause()
								this.$emit('continuePlay',true)
							}else{
								this.$emit('continuePlay',false)
							}
						}
						tools.navigateToWelfare()
					}
					break;
				}
			},
		}
	}
</script>
<style lang="scss" scoped>
	.video-swiper,.swiper-item{
		flex: 1;
		height: inherit!important;
	}
	.video-player{
		position: absolute;
		width: 100%;
		height: 100%;
	}
	.video-swiper,.video-player{
		background-color: #000000;
		z-index: 0!important;
	}
	.video-poster {
		background-color: #000000;
		width: 100%;
		height: 100%;
	}
	.video-mask{
		z-index: 9;
	}
	.playState {
		position: absolute;
		top: 0;
		left: 0;
		bottom: 50px;
		right: 0;
		width: 120rpx;
		height: 120rpx;
		margin: auto;
		z-index: 5;
	}
	
	/*右侧工具*/
	.video-tools {
		position: fixed;
		right: 20rpx;
		overflow: initial;
		width: 100rpx;
	}
	
	.video_bottom {
		.video-time {
			display: flex;
			// background-color: blueviolet;
			align-items: center;
			width: 100%;
			justify-content: center;
	
			.slider-view {
				width: 70%;
				flex-shrink: 0;
			}
	
			.video-time-current {
				color: #fff;
			}
		}
	
		.video-info-current {
			color: #fff;
			font-size: 34rpx;
			margin: 0px 40rpx 0px 40rpx;
			.video-info-btn {
				padding-left: 30rpx;
				.arrow-right-title {
					font-size: 32rpx;
					margin-right: 0rpx;
				}
			}
	
		}
	
	}
	
	.video-tools .control-wrap {
		line-height: 60rpx;
		overflow: initial;
		width: 100rpx;
	}
	
	.video-tools .item {
		position: relative;
		text-align: center;
		margin-top: 30rpx;
		background: none;
		width: 100rpx;
		padding: 0;
	}
	
	.video-tools .item::after {
		display: none;
	}
	
	.video-tools .icon {
		display: inline-block;
		position: relative;
		width: 70rpx;
		height: 70rpx;
		margin-bottom: 12rpx;
		font-size: 0;
		overflow: hidden;
		vertical-align: middle;
		z-index: 9999;
	}
	
	.video-tools .item .txt {
		display: block;
		line-height: 1;
		font-size: 26rpx;
		font-weight: 400;
		height: 30rpx;
		text-shadow: 0 0 8rpx rgba(0, 0, 0, .3);
		color: rgba(255, 255, 255, 1);
	}
	
	.video-tools .avatar {
		display: inline-block;
		position: relative;
		width: 100rpx;
		height: 100rpx;
		margin-bottom: 12rpx;
		font-size: 0;
		overflow: hidden;
		vertical-align: middle;
		z-index: 88;
		border-radius: 50%;
		box-sizing: border-box;
		border: 4rpx solid #fff;
	}
	
	.video-tools .add {
		position: absolute;
		width: 30rpx;
		height: 30rpx;
		left: 37rpx;
		bottom: 5rpx;
		z-index: 99;
	}
	
	
	/*弹出商品*/
	.video-goods {
		width: 360rpx;
		height: 160rpx;
		border-radius: 8rpx;
		background: #fff;
		position: fixed;
		animation: slideContentUp 0.4s linear both;
		bottom: 40rpx;
		left: 20rpx;
		padding: 0;
		z-index: 998;
		box-sizing: border-box;
	}
	
	/* 动态设置高度 */
	@keyframes slideContentUp {
		from {
			height: 0;
		}
	
		to {
			height: 160rpx;
		}
	}
	
	.video-goods cover-image {
		width: 450rpx;
		height: 250rpx;
		border-radius: 8rpx;
		overflow: hidden;
	}
	
	.video-goods .icon-hide {
		position: absolute;
		right: 10rpx;
		top: 10rpx;
		color: rgba(0, 0, 0, .6);
		z-index: 999;
		width: 40rpx;
		height: 40rpx;
	}
	
	/*商户名称*/
	.video-info {
		position: absolute;
		bottom: 50rpx;
		color: #fff;
		font-size: 30rpx;
		left: 30rpx;
	}
	
	.shopname {
		font-size: 34rpx;
		font-weight: 500;
	}
	
	.video-info .videotitle {
		font-size: 28rpx;
		width: 500rpx;
		word-break: break-all;
		white-space: normal;
		margin-top: 5rpx;
	}
	
	
	/*迷你商品*/
	.video-item {
		position: relative;
		color: #fff;
		font-size: 35rpx;
		background: rgba(0, 0, 0, 0.6);
		padding: 10rpx 10rpx;
		margin-bottom: 10rpx;
		border-radius: 8rpx;
		z-index: 88;
		overflow: hidden;
		width: auto;
		display: inline-block;
	}
	
	.video-item .item-cart {
		float: left;
		width: 40rpx;
		height: 40rpx;
		margin-right: 10rpx;
	}
	
	.video-item .item-title {
		float: left;
		font-size: 28rpx;
		line-height: 40rpx;
		height: 40rpx;
		overflow: hidden;
		white-space: nowrap;
		word-wrap: break-word;
		max-width: 420rpx;
		overflow: hidden;
	}
	
	/* 以下为光盘的样式 */
	.video-disk {
		// position: fixed;
		// bottom: 10rpx;
		// right: 10rpx;
		width: 60rpx;
		height: 60rpx;
	}
	
	.video-disk .music-cover {
		position: relative;
		width: 60rpx;
		height: 60rpx;
		border-radius: 100%;
		box-shadow: 0 2rpx 4rpx 0 rgba(0, 0, 0, .2);
		/* animation: rotate 5s linear infinite; */
		z-index: 2;
		box-sizing: border-box;
	}
	
	.video-disk .music-cover .music-disk {
		width: 60rpx;
		height: 60rpx;
		border-radius: 50%;
	}
	
	.video-disk .music-cover .music-logo {
		width: 60rpx;
		height: 60rpx;
		border-radius: 50%;
		position: absolute;
		opacity: 0.8;
		left: 10rpx;
		top: 10rpx;
	}
	
	.video-disk .note-wrap {
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		z-index: 0;
	}
	
	.video-disk .note {
		position: absolute;
		width: 40rpx;
		height: 30rpx;
		left: -25rpx;
		bottom: 6rpx;
		opacity: 0;
		z-index: 999;
		-webkit-animation: note 1.8s linear .6s infinite;
		animation: note 1.8s linear .6s infinite;
	}
	
	@keyframes rotate {
		from {
			transform: rotate(0deg)
		}
	
		to {
			transform: rotate(359deg)
		}
	}
	
	.video-disk .note:nth-child(2) {
		-webkit-animation: note 1.8s linear 1.2s infinite;
		animation: note 1.8s linear 1.2s infinite
	}
	
	.video-disk .note:nth-child(3) {
		-webkit-animation: note 1.8s linear 1.8s infinite;
		animation: note 1.8s linear 1.8s infinite
	}
	
	@keyframes note {
		0% {
			trnaform: translate(0, 0) rotate(0) scale(1);
			opacity: 1
		}
	
		50% {
			transform: translate(-24rpx, -30rpx) rotate(15deg) scale(.8);
			opacity: .8
		}
	
		100% {
			transform: translate(-16rpx, -60rpx) rotate(30deg) scale(.6);
			opacity: 0
		}
	}
	
	.cu-form-group .title {
		min-width: calc(4em + 30rpx);
	}
	
	.xianlu-class {
		width: 90rpx;
		height: 36rpx;
		font-size: 24rpx;
		justify-content: center;
		align-items: center;
		display: flex;
		border-radius: 4rpx 4rpx 4rpx 4rpx;
		opacity: 1;
		border: 1rpx solid #E68B3E;
	}
	.video-mask {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0);
	}
	.diyjilibox{
		width: 100%;
		height: 100vh;
		position: absolute;
		left:0;
		top: 0;
		// background: #000000;
		background: #0000009e;
		display: flex;
		justify-content: center;
	}
	.c_box{
		width: 70%;
		height: 120px;
		background: #fff;
		border-radius: 8px;
		position: absolute;
		top: 33vh;
		z-index: 9;
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 20px 20px 0 20px;
		
	}
	.c_box_title{
		font-size: 22px;
		font-weight: 500;
	}
	.c_box_btn{
		width: 85%;
		height: 38px;
		border-radius: 8px;
		background: #E68B3E;
		color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		margin-top: 18px;
		font-size: 18px;
		font-weight: 500;
	}
	.c_box_bottom{
		font-size: 12px;
		font-weight: 400;
		color:#666;
		margin-top: 8px;
	}
</style>